<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>店铺页面</title>
    <script src="js/baiduTemplate.js"></script>
    <script src="js/jquery-1.11.1.min.js"></script>
</head>
<style>
    *{
        margin: 0;
        padding: 0;
    }
    #box{
        text-align: center;
        background-color:gainsboro;
        height:80px;
        width: 100%;
        line-height: 80px;
    }
    #shopLists{
        width:1000px;
        background-color:lightgoldenrodyellow;
        margin: auto;
        clear: both;
    }
    .xunhuan{
        width:800px;
        height: 150px;
        border-bottom: 1px solid grey;
    }
    img{
        width: 100px;
        height: 100px;
        margin-top: 20px;
        margin-left: 20px;
        float: left;
        display: inline-block;
    }
    .text{
        font-size: 15px;
        float: left;
        display: inline-block;
    }
    .content{
        margin-left: 50px;
        margin-top:20px;
    }
    a{
        margin-top:10px;
        display: inline-block;
        text-decoration: none;
        color: blue;
    }
    .buy{
        width: 200px;
        position: relative;
        left: 810px;
        top:10px;
    }
</style>
<body>
<!--店铺-->

<div id="box">
    <h1></h1>
</div>
<!--店铺列表-->
<div id="shopLists">

    <div id="products">

    </div>
</div>
</body>
<script type="text/html" id="goods-temp">
    <%for(var i = 0 ; i < arr.length ; i++){%>
    <div class="xunhuan">
        <div class="text">
            <img src="<%=arr[i].product_img%>"/>
            <a href="#"><%=arr[i].product_name%></a><br>
            <div class="content">
                <b>服务内容：</b><%=arr[i].service_desc%>
            </div>
        </div>
        <div class="buy">
            <b class="price">￥<%=arr[i].product_price%></b>
            <button class="myCar"  onclick = "clickFn('<%=arr[i].product_id%>')">立即购买</button>
        </div>
    </div>
    <%}%>
</script>
<script type="text/javascript">
    var ids=localStorage.shop;
    var obj={};
//    console.log(id)
    getmessage();
    function getmessage() {
//        console.log(1)

        $.ajax({
            type:"get",
            url:"http://localhost:2017/getshop",
            data:{
                id:ids
            },
            success:function (res) {
                console.log(res)
                obj.arr=res;
          $("h1").html(res.shop_name)

            }
        })
    }
    $.getJSON("http://localhost:2017/src/data/shangpinlist1.json",function (res) {
        console.log(res);
        var obj={};
        obj.arr=res.product;
        $("#products").html(baidu.template("goods-temp",obj))
    })

</script>
</html>